
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>16110100521谭创浩</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="apple-touch-icon" href="apple-touch-icon.png">

        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/bootstrap-theme.min.css">
        <link rel="stylesheet" href="css/fontAwesome.css">
        <link rel="stylesheet" href="css/light-box.css">
        <link rel="stylesheet" href="css/owl-carousel.css">
        <link rel="stylesheet" href="css/templatemo-style.css">

        <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" rel="stylesheet">

        <script src="js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
    </head>

<body>



        <header class="nav-down responsive-nav hidden-lg hidden-md">
           
            <button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav"> 
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <!--/.navbar-header-->
            <div id="main-nav" class="collapse navbar-collapse">
                <nav>
                    <ul class="nav navbar-nav">
                        <li><a href="#top">首页</a></li>
                        <li><a href="#featured"> 作业</a></li>
                        <li><a href="#projects">作品</a></li>
                        <li><a href="#video">描述</a></li>
                        <li><a href="#blog">我的博客</a></li>
                        <li><a href="#contact"> 快点来帮我呀</a></li>
                    </ul>
                </nav>
            </div>
        </header>

        <div class="sidebar-navigation hidde-sm hidden-xs">
            <div class="logo">
                <a href="#">QQ：<em>532033552</em></a>
            </div>
            <nav>
                <ul>
                    <li>
                        <a href="#top">
                            <span class="rect"></span>
                            <span class="circle"></span>
                            首页
                        </a>
                    </li>
                    <li>
                        <a href="#featured">
                            <span class="rect"></span>
                            <span class="circle"></span>
                            作业
                        </a>
                    </li>
                    <li>
                        <a href="#projects">
                            <span class="rect"></span>
                            <span class="circle"></span>
                            作品
                        </a>
                    </li>
                    <li>
                        <a href="#video">
                            <span class="rect"></span>
                            <span class="circle"></span>
                            描述
                        </a>
                    </li>
                    <li>
                        <a href="#blog">
                            <span class="rect"></span>
                            <span class="circle"></span>
                            我的博客
                        </a>
                    </li>
                    <li>
                        <a href="#contact">
                            <span class="rect"></span>
                            <span class="circle"></span>
                            快点来帮我呀
                        </a>
                    </li>
                </ul>
            </nav>
           <!--
           	作者：offline
           	时间：2018-10-21
           	描述：
           <ul class="social-icons">
                <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                <li><a href="#"><i class="fa fa-rss"></i></a></li>
                <li><a href="#"><i class="fa fa-behance"></i></a></li> -->
            </ul>
        </div>

        <div class="slider">
            <div class="Modern-Slider content-section" id="top">
                <!-- Item -->
                <div class="item item-1">
                    <div class="img-fill">
                    <div class="image"></div>
                    <div class="info">
                        <div>
                          <h1>谭创浩  16110100521</h1>
                          <p>tch
                          			
                          <div class="white-button button">
                              <a href="#featured">作业</a>
                          </div>
                        </div>
                        </div>
                    </div>
                </div>
                <!-- // Item -->
                <!-- Item -->
                <div class="item item-2">
                    <div class="img-fill">
                        <div class="image"></div>
                        <div class="info">
                        <div>
                          <h1>16110100521 <br>谭创浩</h1>
                         
                          
                          <div class="white-button button">
                              <a href="#featured">作业</a>
                          </div>
                        </div>
                        </div>
                    </div>
                </div>
                <!-- // Item -->
                <!-- Item -->
                <div class="item item-3">
                    <div class="img-fill">
                        <div class="image"></div>
                        <div class="info">
                        <div>
                          <h1>谭创浩<br>16110100521</h1>
                         
                          
                          <div class="white-button button">
                              <a href="#featured">作业</a>
                          </div>
                        </div>
                        </div>
                    </div>
                </div>
                <!-- // Item -->
            </div>
        </div>


        <div class="page-content">
            <section id="featured" class="content-section">
                <div class="section-heading">
                    <h1>网页作业<br><em>TCH</em></h1>
                    <p>我啥都不会啊
                    <br>什么都不懂</p>
                </div>
                <div class="section-content">
                    <div class="owl-carousel owl-theme">
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_1.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">我的妈耶</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>作业一</h4>
                                <span>网页截图</span>
                                <br> <a href="网页截图/tu.html">预览</a><br>
                               <br> <a href="网页截图/jietu.html">网页截图</a><br>
                            </div>
                        </div>
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_2.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">悄悄的尝试</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>作业二</h4>
                                <span>HTML+CSS水平测试3</span>
                                <p>
									<a href="水平测试a1/a1.html">HTML+CSS水平测试1--a1</a><br>
									<a href="水平测试a2/a2.html">HTML+CSS水平测试1--a2</a><br>
									<a href="水平测试a3/a3.html">HTML+CSS水平测试1--a3</a><br>
							   </p>

                            </div>
                        </div>
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_3.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">发现了东西</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>作业三</h4>
                                <span>网页设计</span>
                               <br> <a href="网页设计3/网页设计3.html">网页设计3</a><br>
                                 <a href="网页设计21/21.html">网页设计21</a><br>
                                  <a href="网页设计23/23.html">网页设计23</a><br>
                            </div>
                        </div>
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_2.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">这是神马呀</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>课堂实例</h4>
                                <span>基础标签</span>
                                <br> <a href="课堂练习/1.html">基础标签一</a><br>
                                 <a href="课堂练习/2.html">基础标签二</a><br>
                                 <a href="课堂练习/3.html">基础标签三</a><br>
                                 <a href="课堂练习/4.html">基础标签四</a><br>
                            </div>
                        </div>
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_1.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">还有吗？</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>课堂实例</h4>
                                <span>css基础</span>
                               <br> <a href="课堂练习/5.html">CSS基础一</a><br>
                                 <a href="课堂练习/6.html">CSS基础二</a><br>
                                 <a href="课堂练习/7.html">CSS基础三</a><br>
                                 <a href="课堂练习/8.html">CSS基础四</a><br>
                                  <a href="课堂练习/9.html">CSS基础五</a><br>
                            </div>
                        </div>
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_3.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">好好写吧</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>课堂实例</h4>
                                <span>盒模型</span>
                                  <br> <a href="课堂练习/10.html">盒模型基础一</a><br>
                                 <a href="课堂练习/11.html">盒模型基础二</a><br>
                                 <a href="课堂练习/12.html">布局一</a><br>
                                 <a href="课堂练习/13.html">布局二</a><br>
                                  <a href="课堂练习/14.html">布局三</a><br>
                            </div>
                        </div>
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_2.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">继续加油</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>课堂实例</h4>
                                <span>浮动</span>
                               <br> <a href="课堂练习/15.html">浮动一</a><br>
                                 <a href="课堂练习/16.html">浮动二</a><br>
                                 <a href="课堂练习/17.html">一左一右1</a><br>
                                 <a href="课堂练习/18.html">一左一右2</a><br>
                                  <a href="课堂练习/19.html">一左一右3</a><br>
                            </div>
                        </div>
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_1.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">坚持</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>课堂实例</h4>
                                <span>图文模样</span>
                                <br> <a href="课堂练习/20.html">浮动一</a><br>
                                 <a href="课堂练习/21.html">浮动二</a><br>
                                 <a href="课堂练习/22.html">一左一右1</a><br>
                                 <a href="课堂练习/23.html">一左一右2</a><br>
                                  <a href="课堂练习/24.html">一左一右3</a><br>
                            </div>
                        </div>
                        <div class="item">
                            <div class="image">
                                <img src="img/featured_3.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">你好</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>第九次咯</h4>
                                <span>不想说话</span>
                                <p>就这样吧.</p>
                            </div>
                           <!--
                            	作者：offline
                            	时间：2018-10-20
                            	描述：
                           
                            <div class="item">
                            <div class="image">
                                <img src="img/featured_3.jpg" alt="">
                                <div class="featured-button button">
                                    <a href="#projects">你好</a>
                                </div>
                            </div>
                            <div class="text-content">
                                <h4>第九次咯</h4>
                                <span>不想说话</span>
                                <p>就这样吧.</p>
                            </div>-->
                        </div>
                    </div>
                </div>
            </section>
            <section id="projects" class="content-section">
                <div class="section-heading">
                    <h1>近期<br><em>的作品</em></h1>
                    <p>做自己喜欢的事情, 
                    <br>反正都乱来的.</p>
                </div>
                <div class="section-content">
                    <div class="masonry">
                        <div class="row">
                            <div class="item">
                                <div class="col-md-8">
                                    <a href="img/portfolio_big_1.jpg" data-lightbox="image"><img src="img/portfolio_1.jpg" alt="image 1"></a>
                                </div>
                            </div>
                            <div class="item second-item">
                                <div class="col-md-4">
                                    <a href="img/portfolio_big_2.jpg" data-lightbox="image"><img src="img/portfolio_2.jpg" alt="image 2"></a>
                                </div>
                            </div>
                            <div class="item">
                                <div class="col-md-4">
                                    <a href="img/portfolio_big_3.jpg" data-lightbox="image"><img src="img/portfolio_3.jpg" alt="image 3"></a>
                                </div>
                            </div>
                            <div class="item">
                                <div class="col-md-4">
                                    <a href="img/portfolio_big_4.jpg" data-lightbox="image"><img src="img/portfolio_4.jpg" alt="image 4"></a>
                                </div>
                            </div>
                            <div class="item">
                                <div class="col-md-8">
                                    <a href="img/portfolio_big_5.jpg" data-lightbox="image"><img src="img/portfolio_5.jpg" alt="image 5"></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>  <div class="tlinks">Collect from <a href="http://www.cssmoban.com/"  title="网站模板">网站模板</a></div>          
            </section>
            <section id="video" class="content-section">
                <div class="row">
                    <div class="col-md-12">
                        <div class="section-heading">
                            <h1>这是 <em>我的</em> 简历.</h1>
                            <p>还是那句话，我现在什么都不会.</p>
                        </div>
                        <div class="text-content">
                            <p>对于每个人来说，都会有困难的时候，
                            	你会感到举步维艰，会感到呼吸困难，
                            	很多次想要放弃。再努力一点吧，再难，也相信明天
                            	，日子虽平凡，对身边的人好一点。.</p>
                        </div>
                        <div class="accent-button button">
                            <a href="#blog">看看世界</a>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="box-video">
                            <div class="bg-video" style="background-image: url(https://unsplash.imgix.net/photo-1425036458755-dc303a604201?fit=crop&fm=jpg&q=75&w=1000);">
                                <div class="bt-play">Play</div>
                            </div>
                            <div class="video-container" style="height: 400px;">
                               video
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section id="blog" class="content-section">
                <div class="section-heading">
                    <h1>博客<br><em>头条</em></h1>
                    <p>等待我更新. 
                   </p>
                </div>
                <div class="section-content">
                    <div class="tabs-content">
                        <div class="wrapper">
                            <ul class="tabs clearfix" data-tabgroup="first-tab-group">
                              <li><a href="#tab1" class="active">October 2018</a></li>
                              <li><a href="#tab2">November 2018</a></li>
                              <li><a href="#tab3">December 2018</a></li>
                              <li><a href="#tab4">January 2019</a></li>
                            </ul>
                            <section id="first-tab-group" class="tabgroup">
                                <div id="tab1">
                                    <ul>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_1.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>001</h4>
                                                    <span>001 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_2.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>002</h4>
                                                    <span>002 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_3.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>003</h4>
                                                    <span>003 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                                <div id="tab2">
                                    <ul>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_3.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>004</h4>
                                                    <span>004 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_1.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>005</h4>
                                                    <span>005 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_2.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>006</h4>
                                                    <span>006 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                                <div id="tab3">
                                    <ul>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_2.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>007</h4>
                                                    <span>007 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_1.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>008</h4>
                                                    <span>008 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_3.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>009</h4>
                                                    <span>009 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                                <div id="tab4">
                                    <ul>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_1.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>010</h4>
                                                    <span>010 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>                                
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_3.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>011</h4>
                                                    <span>011 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="item">
                                                <img src="img/blog_2.jpg" alt="">
                                                <div class="text-content">
                                                    <h4>012</h4>
                                                    <span>012 2018</span>
                                                    <p>更新中···</p>
                                                    
                                                    <div class="accent-button button">
                                                        <a href="#contact">查看更多</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </section> 
                        </div>
                    </div>
                </div>
            </section>
            <section id="contact" class="content-section">
                <div id="map">
                
                	<!-- How to change your own map point
                           1. Go to Google Maps
                           2. Click on your location point
                           3. Click "Share" and choose "Embed map" tab
                           4. Copy only URL and paste it within the src="" field below
                   
                    map -->
                </div>
                <div id="contact-content">
                    <div class="section-heading">
                        <h1>快来<br><em>帮帮我吧</em></h1>
                        <p>小白菜一枚. 
                        <br>求大神带走.</p>
                        
                    </div>
                    <div class="section-content">
                        <form id="contact" action="#" method="post">
                            <div class="row">
                                <div class="col-md-4">
                                  <fieldset>
                                    <input name="name" type="text" class="form-control" id="name" placeholder="你的名字…" required="">
                                  </fieldset>
                                </div>
                                <div class="col-md-4">
                                  <fieldset>
                                    <input name="email" type="email" class="form-control" id="email" placeholder="你的电子邮件…" required="">
                                  </fieldset>
                                </div>
                                 <div class="col-md-4">
                                  <fieldset>
                                    <input name="subject" type="text" class="form-control" id="subject" placeholder="主题…" required="">
                                  </fieldset>
                                </div>
                                <div class="col-md-12">
                                  <fieldset>
                                    <textarea name="message" rows="6" class="form-control" id="message" placeholder="你的消息…" required></textarea>
                                  </fieldset>
                                </div>
                                <div class="col-md-12">
                                  <fieldset>
                                    <button type="submit" id="form-submit" class="btn">发送</button>
                                  </fieldset>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </section>
            <section class="footer">
               <!--
               	作者：offline
               	时间：2018-10-20
               	描述：
               <p>Copyright &copy; 2018 Company Name . Design: <a href="" target="_blank">Sentra</a> More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>--> 
            </section>
        </div>




    <script src="https://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"><\/script>')</script>

    <script src="js/vendor/bootstrap.min.js"></script>
    
    <script src="js/plugins.js"></script>
    <script src="js/main.js"></script>

    <script>
        // Hide Header on on scroll down
        var didScroll;
        var lastScrollTop = 0;
        var delta = 5;
        var navbarHeight = $('header').outerHeight();

        $(window).scroll(function(event){
            didScroll = true;
        });

        setInterval(function() {
            if (didScroll) {
                hasScrolled();
                didScroll = false;
            }
        }, 250);

        function hasScrolled() {
            var st = $(this).scrollTop();
            
            // Make sure they scroll more than delta
            if(Math.abs(lastScrollTop - st) <= delta)
                return;
            
            // If they scrolled down and are past the navbar, add class .nav-up.
            // This is necessary so you never see what is "behind" the navbar.
            if (st > lastScrollTop && st > navbarHeight){
                // Scroll Down
                $('header').removeClass('nav-down').addClass('nav-up');
            } else {
                // Scroll Up
                if(st + $(window).height() < $(document).height()) {
                    $('header').removeClass('nav-up').addClass('nav-down');
                }
            }
            
            lastScrollTop = st;
        }
    </script>

   <!--
   	作者：offline
   	时间：2018-10-20
   	描述：
    <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
    
-->
</body>
</html>